<template>
	<div style="padding: 20px;cursor:default; " onselectstart="return false">
		<Divider style="font-size: 18px;">本地磁盘</Divider>
		<div style="float: left;padding-left: 20px;">
			<Card>
				<div style="width: 300px;height: 90px;"  @dblclick="Disk_Login">
					<div style="float: left;">
						<!-- <Icon type="md-archive" /> -->
						<img src="../assets/icon/6.png" style="width: 70px;" />
						
						<div style="float: right;padding-left: 20px;" >
							<h1>本地磁盘</h1>
							<h4>进入即可管理本地磁盘资料</h4>
						</div>
					</div>
				</div>
			</Card>
		</div>

		<Divider style="font-size: 18px;">网络云盘</Divider>
		<div style="float: left;padding-left: 20px;padding-bottom: 20px;">
			<Card>
				<div style="width: 300px;height: 90px;;" @dblclick="Baidu_Login">
					<div style="float: left;margin-top: 10px">
						<!-- <Icon type="md-archive" /> -->
						<img src="../assets/img/Baidu.jpg" style="width: 70px;" />
						<div style="float: right;padding-left: 20px;"  v-show="Baidu == true">
							<h3>用户:{{this.Baidu_name}}</h3>

							<Progress :percent="this.Baidu_scale" style="width: 200px;height: 20px;" />
							<p>已用：{{this.Baidu_used}}  |  总容量：{{this.Baidu_total}}</p>
						</div>
						<div style="float: right;padding-left: 20px;" v-show="Baidu == false">
							<h1>百度网盘</h1>
							<h5>请先登录网盘,才能查看个人信息</h5>
						</div>
					</div>
				</div>
			</Card>
		</div>

		<div style="float: left;padding-left: 20px;padding-bottom: 20px;">
			<Card>
				<div style="width: 300px;height: 90px;" @dblclick="weiyun_Login">
					<div style="float: left;margin-top: 10px">
						<!-- <Icon type="md-archive" /> -->
						<img src="../assets/img/weiyun.jpg" style="width: 70px;" />
						<div style="float: right;padding-left: 20px;" v-show="weiyun == true">
							<h3>用户:冇乜</h3>

							<Progress :percent="36.84" style="width: 200px;height: 20px;" />

							<p>已用：3.68 GB  |  总容量：10 GB</p>
						</div>
						<div style="float: right;padding-left: 20px;" v-show="weiyun == false">
					 		<h1>微云网盘</h1>
							<h5>请先登录网盘,才能查看个人信息</h5>
						</div>
					</div>
				</div>
			</Card>
		</div>

		<div style="float: left;padding-left: 20px;padding-bottom: 20px;">
			<Card>
				<div style="width: 300px;height: 90px;" @dblclick="lanzou_Login">
					<div style="float: left;margin-top: 10px">
						<!-- <Icon type="md-archive" /> -->
						<img src="../assets/img/lanzou.jpg" style="width: 70px;" />
						<div style="float: right;padding-left: 20px;" v-show="lanzou == true">
							<h3>蓝奏云</h3>
							<Progress :percent="25" style="width: 200px;height: 20px;" />
							<p>200g已用，共500g</p>
						</div>
						<div style="float: right;padding-left: 20px;" v-show="lanzou == false">
							<h1>蓝奏云网盘</h1>
							<h5>请先登录网盘,才能查看个人信息</h5>
						</div>
					</div>
				</div>
			</Card>
		</div>

		<div style="float: left;padding-left: 20px;padding-bottom: 20px;">
			<Card>
				<div style="width: 300px;height: 90px;" @dblclick="jianguo_Login">
					<div style="float: left;margin-top: 10px">
						<!-- <Icon type="md-archive" /> -->
						<img src="../assets/img/jianguoyun.jpg" style="width: 70px;" />
						<div style="float: right;padding-left: 20px;"v-show="jianguo == true">
							<h3>用户:酷猫网盘</h3>
							<Progress :percent="25" style="width: 200px;height: 20px;" />
							<p>已用：0.21 GB  |  总容量：3 GB</p>
						</div>
						<div style="float: right;padding-left: 20px;" v-show="jianguo == false">
							<h1>坚果云盘</h1>
							<h5>请先登录网盘,才能查看个人信息</h5>
						</div>
					</div>
				</div>
			</Card>
		</div>

		<div style="float: left;padding-left: 20px;padding-bottom: 20px;">
			<Card>
				<div style="width: 300px;height: 90px;" @dblclick="chuangyi_Login">
					<div style="float: left;margin-top: 10px">
						<!-- <Icon type="md-archive" /> -->
						<img src="../assets/img/chuangyi.jpg" style="width: 70px;" />
						<div style="float: right;padding-left: 20px;" v-show="chuangyi == true">
							<h3>创意云盘</h3>
							<Progress :percent="25" style="width: 200px;height: 20px;" />
							<p>200g已用，共500g</p>
						</div>
						<div style="float: right;padding-left: 20px;" v-show="chuangyi == false">
							<h1>创意云盘</h1>
							<h5>请先登录网盘,才能查看个人信息</h5>
						</div>
					</div>
				</div>
			</Card>
		</div>

		<div style="float: left;padding-left: 20px;padding-bottom: 20px;">
			<Card>
				<div style="width: 300px;height: 90px;" @dblclick="biteqiu_Login">
					<div style="float: left;margin-top: 10px">
						<!-- <Icon type="md-archive" /> -->
						<img src="../assets/img/biteqiu.jpg" style="width: 70px;" />
						<div style="float: right;padding-left: 20px;" v-show="biteqiu == true">
							<h3>比特球云盘</h3>
							<Progress :percent="25" style="width: 200px;height: 20px;" />
							<p>200g已用，共500g</p>
						</div>
						<div style="float: right;padding-left: 20px;" v-show="biteqiu == false">
							<h1>比特球云盘</h1>
							<h5>请先登录网盘,才能查看个人信息</h5>
						</div>
					</div>
				</div>
			</Card>
		</div>

		<div style="float: left;padding-left: 20px;padding-bottom: 20px;">
			<Card>
				<div style="width: 300px;height: 90px;" @dblclick="chengtong_Login">
					<div style="float: left;margin-top: 10px">
						<!-- <Icon type="md-archive" /> -->
						<img src="../assets/img/chengtong.jpg" style="width: 70px;" />
						<div style="float: right;padding-left: 20px;" v-show="chengtong == true">
							<h3>城通网盘</h3>

							<Progress :percent="25" style="width: 200px;height: 20px;" />

							<p>200g已用，共500g</p>
						</div>
						<div style="float: right;padding-left: 20px;" v-show="chengtong == false">
							<h1>城通网盘</h1>
							<h5>请先登录网盘,才能查看个人信息</h5>
						</div>
					</div>
				</div>
			</Card>
		</div>

		<div style="float: left;padding-left: 20px;padding-bottom: 20px;">
			<Card>
				<div style="width: 300px;height: 90px;" @dblclick="wenshushu_Login">
					<div style="float: left;margin-top: 10px">
						<!-- <Icon type="md-archive" /> -->
						<img src="../assets/img/wen.jpg" style="width: 70px;" />
						<div style="float: right;padding-left: 20px;" v-show="wenshushu == true">
							<h3>文叔叔网盘</h3>
							<Progress :percent="25" style="width: 200px;height: 20px;" />
							<p>200g已用，共500g</p>
						</div>
						<div style="float: right;padding-left: 20px;" v-show="wenshushu == false">
							<h1>文叔叔网盘</h1>
							<h5>请先登录网盘,才能查看个人信息</h5>
						</div>
					</div>
				</div>
			</Card>
		</div>

		<div style="float: left;padding-left: 20px;padding-bottom: 20px;">
			<Card>
				<div style="width: 300px;height: 90px;" @dblclick="xiaomai_Login">
					<div style="float: left;margin-top: 10px">
						<!-- <Icon type="md-archive" /> -->
						<img src="../assets/img/xiaomai.jpg" style="width: 70px;" />
						<div style="float: right;padding-left: 20px;" v-show="xiaomai == true">
							<h3>小麦云盘</h3>

							<Progress :percent="25" style="width: 200px;height: 20px;" />

							<p>200g已用，共500g</p>
						</div>
						<div style="float: right;padding-left: 20px;" v-show="xiaomai == false">
							<h1>小麦云盘</h1>
							<h5>请先登录网盘,才能查看个人信息</h5>
						</div>
					</div>
				</div>
			</Card>
		</div>
		
		<Divider style="font-size: 18px;">服务器协议</Divider>
		<div style="float: left;padding-left: 20px;padding-bottom: 20px;" class="li">
			<Card>
				<div style="width: 300px;height: 90px;" @dblclick="Seafile_Login">
					<div style="float: left;margin-top: 10px">
						<!-- <Icon type="md-archive" /> -->
						<img src="../assets/img/Seafile.jpg" style="width: 70px;" />
						<div style="float: right;padding-left: 20px;">
							<h1>Seafile私有云</h1>
							<h5>请进入多账号管理页面，选择账号登陆</h5>
						</div>
					</div>
				</div>
			</Card>

		</div>

		<div style="float: left;padding-left: 20px;padding-bottom: 20px;" class="li">
			<Card>
				<div style="width: 300px;height: 90px;" @dblclick="ftp_Login">
					<div style="float: left;margin-top: 10px">
						<!-- <Icon type="md-archive" /> -->
						<img src="../assets/img/FTP.jpg" style="width: 70px;" />
						<div style="float: right;padding-left: 20px;">
							<h1>FTP协议</h1>
							<h5>请先连接FTP协议，才能查看连接信息</h5>
						</div>
					</div>
				</div>
			</Card>

		</div>

		<div style="float: left;padding-left: 20px;padding-bottom: 20px;" class="li">
			<Card>
				<div style="width: 300px;height: 90px;" @dblclick="smb_Login">
					<div style="float: left;margin-top: 10px">
						<!-- <Icon type="md-archive" /> -->
						<img src="../assets/img/SMB.png" style="width: 70px;" />
						<div style="float: right;padding-left: 20px;">
							<h1>SMB协议</h1>
							<h5>请先挂载SMB协议，才能查看连接信息</h5>
						</div>
					</div>
				</div>
			</Card>
		</div>
		
		<div style="float: left;padding-left: 20px;padding-bottom: 20px;" class="li">
			<Card>
				<div style="width: 300px;height: 90px;" @dblclick="NFS_Login">
					<div style="float: left;margin-top: 10px">
						<!-- <Icon type="md-archive" /> -->
						<img src="../assets/img/NFS.png" style="width: 70px;" />
						<div style="float: right;padding-left: 20px;">
							<h1>NFS协议</h1>
							<h5>请先挂载FNFS协议，才能查看连接信息</h5>
						</div>
					</div>
				</div>
			</Card>
		</div>

	</div>
</template>
<script>
	import {
		exec
	} from "child_process";
	export default {
		data(){
			return{
				Baidu:false,
				Baidu_scale:'',
				Baidu_used:'',
				Baidu_total:'',
				Baidu_name:'',
				weiyun:false,
				lanzou:false,
				jianguo:false,
				chuangyi:false,
				biteqiu:false,
				chengtong:false,
				wenshushu:false,
				xiaomai:false,
				Seafile:false,
				ftp:false,
				smb:false,
			}
		},
		mounted() {
			const cmdStr = 'aria2c  --conf-path="./aria2/aria2c.conf"';
			const workerProcess = exec(cmdStr, {
				encoding: "GBK"
			});
			console.log("aria2下载工具启动成功");

			var Baidu_used = window.sessionStorage.getItem('Baidu_used')
			if(Baidu_used != null){
				this.Baidu = true
				var Baidu_used = window.sessionStorage.getItem('Baidu_used')
				var Baidu_total = window.sessionStorage.getItem('Baidu_total')
				var used = ''
				//判断文件大小
				if (Baidu_used < 1024) {
					used = Baidu_used + "B";
				} else if (Baidu_used < 1048576) {
					used = (Baidu_used / 1024).toFixed(1) + "K";
				} else if (Baidu_used < 1073741824) {
					used = (Baidu_used / 1048576).toFixed(1) + "M";
				} else {
					used = (Baidu_used / 1073741824).toFixed(1) + "G";
				}
				var total = ''
				if (Baidu_total < 1024) {
					total = Baidu_total + "B";
				} else if (Baidu_total < 1048576) {
					total = (Baidu_total / 1024).toFixed(1) + "K";
				} else if (Baidu_total < 1073741824) {
					total = (Baidu_total / 1048576).toFixed(1) + "M";
				} else {
					total = (Baidu_total / 1073741824).toFixed(1) + "G";
				}

				// 百度网盘容量比例
				this.Baidu_scale = (Baidu_used / Baidu_total * 100).toFixed(2)
				// 剩余容量
				this.Baidu_used = used
				// 总容量
				this.Baidu_total = total
				// 获取名字
				this.Baidu_name = window.sessionStorage.getItem('Baidu_name')

			}else{
				this.Baidu == false
			}

			// 微云网盘登录判断
			var Weiyun_scale = window.sessionStorage.getItem('Weiyun_scale')
			if(Weiyun_scale == '1'){
				this.weiyun = true
			}


			// 坚果云网盘登录判断
			var Jianguoyun_scale  = window.sessionStorage.getItem('Jianguoyun_scale')
			if(Jianguoyun_scale == '1'){
				this.jianguo = true
			}

		},
		methods:{
			Disk_Login(){
				this.$router.push('/Disk')
			},
			Baidu_Login(){
				this.$router.push('/Baidu_Login')
			},
			weiyun_Login(){
				this.$router.push('/Weiyun_Login')
			},
			lanzou_Login(){
				this.$Message.success("蓝奏云");
			},
			jianguo_Login(){
				this.$router.push('/Jianguo_Login')
			},
			chuangyi_Login(){
				this.$router.push('/Chuangyi_Login')
			},
			biteqiu_Login(){
				this.$router.push('/Biteqiu_Login')
			},
			chengtong_Login(){
				this.$router.push('/ChengTong_Login')
				this.$Message.success("欢迎进入城通！");
			},
			wenshushu_Login(){
				this.$router.push('/Wenshushu_Login')
				this.$Message.success("欢迎进入文叔叔网盘！");
			},
			xiaomai_Login(){
				this.$router.push('/Xiaomai_Login')
				this.$Message.success("欢迎进入小麦网盘！");
			},
			Seafile_Login(){
				this.$router.push('/Seafile_User')
				this.$Message.success("欢迎进入Seafile私有云！");
			},
			ftp_Login(){
				this.$router.push('/FTP_Home')
				this.$Message.success("欢迎进入FTP协议！");
			},
			smb_Login(){
				this.$router.push('/SMB_Login')
				this.$Message.success("欢迎进入SMB协议！");
			},
			NFS_Login(){
				this.$router.push('/NFS_Login')
				this.$Message.success("欢迎进入NFS协议！");
			}
		}
	}
</script>
